<?php
/**
 * 自定义幻灯片全屏
 */
CSF::createWidget('ri_home_van_slider_widget', array(
    'title'       => 'A-VAN-首页模块 : 全屏图片幻灯片',
    'classname'   => 'ri_home_van_slider_widget',
    'description' => '图片幻灯片，支持全宽/普通',
    'fields'      => array(

        array(
            'id'      => 'container',
            'type'    => 'radio',
            'title'   => '布局风格',
            'inline'  => true,
            'options' => array(
                'container-full' => '全宽',
                'container'  => '普通',
            ),
            'default' => 'container-full',
        ),
        array(
            'id'     => 'pc_diy_data',
            'type'   => 'group',
            'title'  => 'PC端幻灯片',
            'fields' => array(
                array(
                    'id'          => '_img',
                    'type'        => 'upload',
                    'title'       => '上传幻灯片',
                    'default'     => get_template_directory_uri() . '/assets/img/slider.jpg',
                ),
                array(
                    'id'      => '_blank',
                    'type'    => 'switcher',
                    'title'   => '新窗口打开链接',
                    'default' => true,
                ),
                array(
                    'id'      => '_href',
                    'type'    => 'text',
                    'title'   => '链接地址',
                    'default' => '',
                ),

            ),
            
        ),
        array(
            'id'     => 'wap_diy_data',
            'type'   => 'group',
            'title'  => 'WAP端幻灯片',
            'fields' => array(
                array(
                    'id'          => '_img',
                    'type'        => 'upload',
                    'title'       => '上传幻灯片',
                    'default'     => get_template_directory_uri() . '/assets/img/slider.jpg',
                ),
                array(
                    'id'      => '_blank',
                    'type'    => 'switcher',
                    'title'   => '新窗口打开链接',
                    'default' => true,
                ),
                array(
                    'id'      => '_href',
                    'type'    => 'text',
                    'title'   => '链接地址',
                    'default' => '',
                ),

            ),
            
        ),
          //PC幻灯CMS设置
        array(
                'id'         => 'pc_slide_cms',
                'type'       => 'group',
                'title'      => 'PC幻灯CMS设置',
                'fields'     => array(
                    array(
                        'id'      => 'img',
                        'type'    => 'upload',
                        'title'   => '图片',
                        'desc'    => '建议尺寸高33px宽33px',
                    ),
                    array(
                        'id'      => 'title',
                        'type'    => 'text',
                        'title'   => '标题',
                    ),
                    array(
                        'id'      => 'subtitle',
                        'type'    => 'text',
                        'title'   => '副标题',
                    ),
                    array(
                        'id'      => 'desc',
                        'type'    => 'text',
                        'title'   => '描述',
                    ),
                ),
            ),
              //WAP幻灯CMS设置
        array(
                'id'         => 'wap_slide_cms',
                'type'       => 'group',
                'title'      => 'WAP幻灯CMS设置',
                'fields'     => array(
                    array(
                        'id'      => 'img',
                        'type'    => 'upload',
                        'title'   => '图片',
                        'desc'    => '建议尺寸高33px宽33px',
                    ),
                    array(
                        'id'      => 'title',
                        'type'    => 'text',
                        'title'   => '标题',
                    ),
                    array(
                        'id'      => '_link',
                        'type'    => 'text',
                        'title'   => '链接地址',
                    ),
                ),
            ),
        array(
            'id'      => 'config',
            'type'    => 'checkbox',
            'title'   => '幻灯片配置',
            'options' => array(
                'autoplay' => '自动播放',
                'loop'     => '循环播放',
                'nav'      => '切换按钮',
            ),
            'inline'  => true,
            'default' => array('autoplay'),
        ),
    ),
));

if (!function_exists('ri_home_van_slider_widget')) {
    function ri_home_van_slider_widget($args, $instance) {
        if (strpos( $args['id'], 'home-center' ) === false) {
            return false; //非首页模块页面不显示
        }
        $instance = array_merge( array( 
            'diy_data' => array(),
            'config'    => array('autoplay'),
        ), $instance);

        echo $args['before_widget'];
        $container    = $instance['container'];
        $config = [
            'lazyLoad' => true,
            'autoplay' => false,
            'loop'     => false,
            'nav'      => false,
        ];

        foreach ($instance['config'] as $key) {
            $config[$key] = true;
        }
        $config['items'] = 1;
        if(wp_is_mobile()){
            $data = $instance['wap_diy_data'];
        }else{
             $data = $instance['pc_diy_data'];
        }
        
        ?>

<div class="<?php echo $container;?>">
	<div class="widget-slider owl-carousel owl-theme" data-config='<?php echo json_encode($config);?>'>

		<?php foreach ($data as $item) : ?>

		<div class="item">
			<div class="widget-slider-item">
				<img class="slider-img owl-lazy" data-src="<?php echo $item['_img'];?>">
				<div class="container slider-warp">
					<?php echo $item['_desc'];?>
				</div>
				<?php if (!empty($item['_href'])) : ?>
					<a target="<?php echo $item['_target'];?>" class="u-permalink" href="<?php echo $item['_href'];?>"></a>
				<?php endif; ?>
			</div>
		</div>

		<?php endforeach;?>
	  	
	</div>
</div>
 <?php if (wp_is_mobile()) : ?>
<div class="van-app-icobox van-background-default van-hidden@s">
    <div class="container">
        <div class="van-grid-vansmls van-grid">
            <?php 
            if ($instance['wap_slide_cms']) { 
        		foreach ( $instance['wap_slide_cms'] as $key => $value) {
            ?>
            <div class="van-width-mobile-cms">
                <a href="<?php echo $value['_link']; ?>">
                    <img src="<?php echo $value['img']; ?>">
                    <p><?php echo $value['title']; ?></p>
                </a>
            </div>
            <?php } } ?>
                    </div>
    </div>
</div>
  <?php else : ?>
 <div class="slide_2_mk van-visible@s">
	    <div class="container">
	        <div class="slide_2_mkbox van-background-default">
        		<div class="van-grid-vansmls van-grid" >
        		    <?php 
        			if ($instance['pc_slide_cms']) { 
        				foreach ( $instance['pc_slide_cms'] as $key => $value) {
        			?>
        			<div class="van-width-slideer">
        			    <div class="item">
        			        <div class="van-grid-vansmls van-grid" >
        			            <div class="van-width-auto">
                				    <img src="<?php echo $value['img']; ?>" alt="<?php echo $value['title']; ?><?php echo $value['subtitle']; ?>">
                				</div>
                				<div class="van-width-expand">
                					<span><?php echo $value['title']; ?><em><?php echo $value['subtitle']; ?></em></span>
                					<p><?php echo $value['desc']; ?></p>
                				</div>
            				</div>
        				</div>
        			</div>
        			<?php } } ?>
        		</div>
    		</div>
		</div>
	</div>  
  <?php endif; ?>
        <?php  echo $args['after_widget'];

    }
}